<template>
	<view>
		<view class="box1">
			<view>业务类型</view>
			<view class="box1_r">
				<view v-for="(item, index) in yewu" :class="ind == index ? 'active' : ''" @click="xz(index, 0, item.value)">{{ item.title }}</view>
			</view>
		</view>
		<view class="line"></view>
		<view class="box2">
			<view class="fot1">承租人信息</view>
			<view class="box2_1">
				<view class="box2_head">身份证号</view>
				<view class="box2_2">
					<input v-model="a2" type="text" value="" placeholder="请输入" />
					<image class="zxj" src="../../static/54.png" mode="" @click="ocr(1, 1)"></image>
				</view>
			</view>
			<view class="box2_1">
				<view class="box2_head">姓名</view>
				<view class="box2_2"><input v-model="a3" type="text" value="" placeholder="请输入" /></view>
			</view>
			<view class="box2_1">
				<view class="box2_head">手机号码</view>
				<view class="box2_2"><input v-model="a4" type="text" value="" placeholder="请输入" /></view>
			</view>
			<view class="box2_1">
				<view class="box2_head">户籍地址</view>
				<view class="box2_2"><input v-model="ydata01" type="text" value="" placeholder="请输入" /></view>
			</view>
			<view class="box2_1">
				<view class="box2_head">有效期(开始日期)</view>
				<view class="box2_2"><input v-model="ydata02" type="text" value="" placeholder="请输入" /></view>
			</view>
			<view class="box2_1">
				<view class="box2_head">有效期(结束日期)</view>
				<view class="box2_2"><input v-model="ydata03" type="text" value="" placeholder="请输入" /></view>
			</view>
			<view class="box2_1">
				<view class="box2_head">性别</view>
				<view class="box2_2"><input v-model="ydata04" type="text" value="" placeholder="请输入" /></view>
			</view>
			<view class="box2_1">
				<view class="box2_head">民族</view>
				<view class="box2_2"><input v-model="ydata05" type="text" value="" placeholder="请输入" /></view>
			</view>
			<view class="box2_1">
				<view class="box2_head">生日</view>
				<view class="box2_2"><input v-model="ydata06" type="text" value="" placeholder="请输入" /></view>
			</view>
			<view class="box2_1">
				<view class="box2_head">婚姻状况</view>
				<view class="box2_2">
					<view :class="ind1 == index ? 'active box2_3' : 'box2_3'" v-for="(item, index) in hunyin" @click="xz(index, 1, item.value)">{{ item.title }}</view>
				</view>
			</view>
			<view class="box2_1">
				<view class="box2_head">是否有担保人</view>
				<view class="box2_2">
					<view :class="ind2 == index ? 'active box2_3' : 'box2_3'" v-for="(item, index) in shifou" @click="xz(index, 2, item.value)">{{ item.title }}</view>
				</view>
			</view>
			<view class="box2_1" style="border: none;">
				<view class="box2_head">备注</view>
				<view class="box2_2"><input v-model="a10" type="text" value="" placeholder="请输入" /></view>
			</view>
		</view>
		<view class="line"></view>
		<view class="box2">
			<view class="fot1">配偶信息</view>
			<view class="box2_1">
				<view class="box2_head">身份证号</view>
				<view class="box2_2">
					<input type="text" v-model="a7" value="" placeholder="请输入" />
					<image class="zxj" src="../../static/54.png" mode="" @click="ocr(1, 2)"></image>
				</view>
			</view>
			<view class="box2_1">
				<view class="box2_head">姓名</view>
				<view class="box2_2"><input v-model="a8" type="text" value="" placeholder="请输入" /></view>
			</view>
			<view class="box2_1" style="border: none;">
				<view class="box2_head">手机号码</view>
				<view class="box2_2"><input v-model="a9" type="text" value="" placeholder="请输入" /></view>
			</view>
		</view>
		<view class="line"></view>
		<view class="box2">
			<view class="fot1">征信授权查询</view>
			<view class="box3">
				<image class="xing" src="../../static/59.png" mode=""></image>
				请上传征信授权查询
			</view>
			<view class="box4">
				<view @click="uploading(1)">
					<image :src="a11" mode=""></image>
					<view>身份证正面</view>
				</view>
				<view @click="uploading(2)">
					<image :src="a12" mode=""></image>
					<view>身份证反面</view>
				</view>
				<view @click="uploading(3)">
					<image :src="a13" mode=""></image>
					<view>征信面签照</view>
				</view>
				<view @click="uploading(4)">
					<image :src="a14" mode=""></image>
					<view>征信授权书</view>
				</view>
			</view>
			
			<view class="all_btn" style="margin-bottom: 30rpx;" @click="tj()">提交</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			status:0,
			ind: 0,
			ind1: 0,
			ind2: 0,
			sta: '',
			type: '',
			hunyin: [],
			yewu: [],
			shifou: [],
			a1: '',
			a2: '',
			a3: '',
			a4: '',
			a5: '',
			a6: '',
			a7: '',
			a8: '',
			a9: '',
			a10: '',
			a11: '../../static/55.png',
			a12: '../../static/56.png',
			a13: '../../static/57.png',
			a14: '../../static/58.png',
			a21: '../../static/65.png',
			a22: '../../static/66.png',
			a23: '../../static/67.png',
			a24: '../../static/67.png',
			a25: '../../static/67.png',
			a26: '../../static/67.png',
			a27: '../../static/67.png',
			a28: '../../static/67.png',
			a29: '../../static/67.png',
			a30: '../../static/67.png',
			a31: '../../static/67.png',
			a32: '../../static/67.png',
			ydata01:'',
			ydata02:'',
			ydata03:'',
			ydata04:'',
			ydata05:'',
			ydata06:'',
			option: []
		};
	},
	onLoad: function(option) {
		this.yw_type = JSON.parse(option.item).query02
		this.shujuType('ywlx'); //获取业务类型
		this.shujuType('hyzk'); //获取婚姻状况
		this.shujuType('sf'); //是否
		this.option = JSON.parse(option.item);
		console.log(JSON.parse(option.item));
		if (JSON.parse(option.item).query01 != null) {
			this.a1 = JSON.parse(option.item).query01;
		}
		if (JSON.parse(option.item).query02 != null) {
			this.a1 = JSON.parse(option.item).query02;
		}
		if (JSON.parse(option.item).query03 != null) {
			this.a1 = JSON.parse(option.item).query03;
		}
		if (JSON.parse(option.item).query04 != null) {
			this.a1 = JSON.parse(option.item).query04;
		}
		if (JSON.parse(option.item).query05 != null) {
			this.a1 = JSON.parse(option.item).query05;
		}
		if (JSON.parse(option.item).query06 != null) {
			this.a1 = JSON.parse(option.item).query06;
		}
		if (JSON.parse(option.item).query07 != null) {
			this.a1 = JSON.parse(option.item).query07;
		}
		if (JSON.parse(option.item).query08 != null) {
			this.a1 = JSON.parse(option.item).query08;
		}
		if (JSON.parse(option.item).query09 != null) {
			this.a1 = JSON.parse(option.item).query09;
		}
		if (JSON.parse(option.item).query10 != null) {
			this.a1 = JSON.parse(option.item).query10;
		}
		if (JSON.parse(option.item).query11 != null) {
			this.a1 = JSON.parse(option.item).query11;
		}
		if (JSON.parse(option.item).query12 != null) {
			this.a1 = JSON.parse(option.item).query12;
		}
		if (JSON.parse(option.item).query13 != null) {
			this.a1 = JSON.parse(option.item).query13;
		}
		if (JSON.parse(option.item).query14 != null) {
			this.a1 = JSON.parse(option.item).query14;
		}
	},
	methods: {
		oc:function(e){
			
		},
		uploading: function(index) {
			uni.chooseImage({
				success: chooseImageRes => {
					const tempFilePaths = chooseImageRes.tempFilePaths;
					this.img = tempFilePaths[0];
					uni.uploadFile({
						url: this.$headUrl + 'sys/common/upload',
						filePath: tempFilePaths[0],
						name: 'file',
						header: {
							'X-Access-Token': uni.getStorageSync('token')
						},
						success: res => {
							console.log(JSON.parse(res.data));
							if (JSON.parse(res.data).success) {
								if (index == 1) {
									this.a11 = JSON.parse(res.data).message;
									uni.uploadFile({
										url: this.$headUrl + 'sys/common/uploadsb', //仅为示例，非真实的接口地址
										filePath: this.img,
										name: 'file',
										header: {
											'X-Access-Token': uni.getStorageSync('token')
										},
										formData: {
											sbtype: 'idface'
										},
										success: res => {
											console.log(JSON.parse(res.data).message)
											//承租人身份证正面
											this.a2 = JSON.parse(res.data).result.num;
											this.a3 = JSON.parse(res.data).result.name;
											this.ydata01 = JSON.parse(res.data).result.address
											this.ydata04 = JSON.parse(res.data).result.sex
											this.ydata05 = JSON.parse(res.data).result.nationality
											this.ydata06 = JSON.parse(res.data).result.birth
											this.ydata06 = this.ydata06[0]+ this.ydata06[1]+this.ydata06[2]+this.ydata06[3]+'-'+this.ydata06[4]+this.ydata06[5]+'-'+this.ydata06[6]+this.ydata06[7]
											console.log(JSON.parse(res.data).result);
										}
									});
								} else if (index == 2) {
									console.log(13521515)
									this.a12 = JSON.parse(res.data).message;
									uni.uploadFile({
										url: this.$headUrl + 'sys/common/uploadsb', //仅为示例，非真实的接口地址
										filePath: this.img,
										name: 'file',
										header: {
											'X-Access-Token': uni.getStorageSync('token')
										},
										formData: {
											sbtype: 'idback'
										},
										success: res => {
											let a = JSON.parse(res.data).result
											this.ydata02 = a.start_date[0] + a.start_date[1] + a.start_date[2] + a.start_date[3] + '-' + a.start_date[4] + a.start_date[5] + '-' + a.start_date[6] + a.start_date[7]
											this.ydata03 = a.end_date[0] + a.end_date[1] + a.end_date[2] + a.end_date[3] + '-' + a.end_date[4] + a.end_date[5] + '-' + a.end_date[6] + a.end_date[7]
										}
									});
								} else if (index == 3) {
									this.a13 = JSON.parse(res.data).message;
								} else if (index == 4) {
									this.a14 = JSON.parse(res.data).message;
								} 
							}
						}
					});
				}
			});
		},
		tj: function() {
			if(this.status == 0){
				let t11;
				let t12;
				let t13;
				let t14;
				let t21;
				let t22;
				let t23;
				let t24;
				let t25;
				let t26;
				let t27;
				let t28;
				let t29;
				let t30;
				let t31;
				let t32;
				if (this.a11 != '../../static/55.png') {t11 = this.a11;}
				if (this.a12 != '../../static/56.png') {t12 = this.a12;}
				if (this.a13 != '../../static/57.png') {t13 = this.a13;}
				if (this.a14 != '../../static/58.png') {t14 = this.a14;}
				if (this.a21 != '../../static/65.png') {t21 = this.a21;}
				if (this.a22 != '../../static/66.png') {t22 = this.a22;}
				if (this.a23 != '../../static/67.png') {t23 = this.a23;}
				if (this.a24 != '../../static/67.png') {t24 = this.a24;}
				if (this.a25 != '../../static/67.png') {t25 = this.a25;}
				if (this.a26 != '../../static/67.png') {t26 = this.a26;}
				if (this.a27 != '../../static/67.png') {t27 = this.a27;}
				if (this.a28 != '../../static/67.png') {t28 = this.a28;}
				if (this.a29 != '../../static/67.png') {t29 = this.a29;}
				if (this.a30 != '../../static/67.png') {t30 = this.a30;}
				if (this.a31 != '../../static/67.png') {t31 = this.a31;}
				if (this.a32 != '../../static/67.png') {t32 = this.a32;}
				console.log(this.a1,51515)
				this.$post('buse/fxjBuse_01/add', {
					query01: this.a1, //业务类型
					query02: this.a2, //身份号
					query03: this.a3, //姓名
					query04: this.a4, //手机号码
					query05: this.a5, //婚姻状况
					query06: this.a6, //是否有担保人
					query07: this.a7, //配偶身份证
					query08: this.a8, //配偶姓名
					query09: this.a9, //配偶手机号
					query10: this.a10, //备注
					query11: t11,
					query12: t12,
					query13: t13,
					query14: t14,
					query16: 'dsp',
					query17: '待审批',
					query21: t21,
					query22: t22,
					query23: t23,
					query24: t24,
					query25: t25,
					query26: t26,
					query27: t27,
					query28: t28,
					query29: t29,
					query30: t30,
					query31: t31,
					query32: t32,
					ydata01:this.ydata01,
					ydata02:this.ydata02,
					ydata03:this.ydata03,
					ydata04:this.ydata04,
					ydata05:this.ydata05,
					ydata06:this.ydata06,
					// rid:"10",
					// id:"1266937425505169410"
				}).then(res => {
					if (res.data.success) {
						uni.showToast({
							title: res.data.message,
							icon: 'none'
						});
						setTimeout(() => {
							uni.redirectTo({
								url: '../yewu_order/yewu_order?type=dsp'
							});
						}, 1000);
					}
					console.log(res.data.success);
				});
			}
			this.status = 1
			setTimeout(()=>{
				this.status = 0
			},3000)
		},
		shujuType: function(type) {
			this.$get('sys/dict/getDictItems/' + type).then(item => {
				if (type == 'hyzk') {
					//婚姻状况
					this.hunyin = item.data.result;
					this.a5 = item.data.result[0].value;
				} else if (type == 'ywlx') {
					//业务类型
					this.yewu = item.data.result;
					console.log(this.yewu)
					this.yewu.forEach((item,index)=>{
						if(item.title == this.yw_type){
							console.log(item,this.yw_type)
							this.ind = index;
							this.a1 = item.value
						}
					})
					// if (this.sta == '') {
					// 	this.a1 = item.data.result[0].value;
					// 	console.log(item.data.result,9999)
					// 	console.log(this.a1)
					// }
				} else if (type == 'sf') {
					//是否
					this.shifou = item.data.result;
					this.a6 = item.data.result[0].value;
				}
			});
		},
		ocr: function(e, o) {
			let type;
			if (e == 1) {
				//身份证正面
				type = 'idface';
			} else if (e == 2) {
				//身份证反面
				type = 'idback';
			} else if (e == 3) {
				//行驶证正面
				type = 'xshface';
			} else if (e == 4) {
				//行驶证反面
				type = 'xshback';
			} else if (e == 5) {
				//车牌
				type = 'chepai';
			}
			uni.chooseImage({
				success: chooseImageRes => {
					const tempFilePaths = chooseImageRes.tempFilePaths;
					this.img = tempFilePaths[0];

					uni.uploadFile({
						url: this.$headUrl + 'sys/common/uploadsb', //仅为示例，非真实的接口地址
						filePath: tempFilePaths[0],
						name: 'file',
						header: {
							'X-Access-Token': uni.getStorageSync('token')
						},
						formData: {
							sbtype: type
						},
						success: res => {
							if (o == 1) {
								console.log(JSON.parse(res.data).message)
								this.a11 = JSON.parse(res.data).message
								//承租人身份证正面
								this.a2 = JSON.parse(res.data).result.num;
								this.a3 = JSON.parse(res.data).result.name;
								this.ydata01 = JSON.parse(res.data).result.address
								this.ydata04 = JSON.parse(res.data).result.sex
								this.ydata05 = JSON.parse(res.data).result.nationality
								this.ydata06 = JSON.parse(res.data).result.birth
								this.ydata06 = this.ydata06[0]+ this.ydata06[1]+this.ydata06[2]+this.ydata06[3]+'-'+this.ydata06[4]+this.ydata06[5]+'-'+this.ydata06[6]+this.ydata06[7]
							} else if (o == 2) {
								//配偶人身份证正面
								this.a7 = JSON.parse(res.data).result.num;
								this.a8 = JSON.parse(res.data).result.name;
							}
							console.log(JSON.parse(res.data).result);
						}
					});
				}
			});
		},
		xz: function(index, type, item) {
			console.log(item);
			if (type == 0) {
				//业务类型
				this.ind = index;
				this.a1 = item;
			} else if (type == 1) {
				//婚姻状况
				this.ind1 = index;
				this.a5 = item;
			} else if (type == 2) {
				//是否有担保人
				this.ind2 = index;
				this.a6 = item;
			}
		}
	}
};
</script>

<style>
.box4 > view > image {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
}
.box4 > view > view{
	margin-top: 110rpx;
}
.box4 > view {
	width: 316rpx;
	height: 211rpx;
	font-size: 22rpx;
	font-family: Microsoft YaHei;
	font-weight: 400;
	color: #666666;
	margin-bottom: 40rpx;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	z-index: 10;
}
.box4 {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}
.xing {
	width: 12rpx;
	height: 14rpx;
	margin-right: 15rpx;
}
.box3 {
	font-size: 22rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: rgba(102, 102, 102, 1);
	margin: 10rpx 0 40rpx 0;
}
.box2_3 {
	/* width:64rpx;
		height:54rpx; */
	padding: 10rpx 20rpx;
	box-sizing: border-box;
	border: 1px solid rgba(153, 153, 153, 1);
	border-radius: 10rpx;
	font-size: 30rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: rgba(51, 51, 51, 1);
	display: flex;
	justify-content: center;
	align-items: center;
	margin-left: 20rpx;
}
.box2_2 > input {
	width: 100%;
	text-align: right;
	font-size: 30rpx;
}
.box2_2 {
	width: 100%;
	display: flex;
	justify-content: flex-end;
	align-items: center;
}
.zxj {
	width: 37rpx;
	height: 32rpx;
	margin-left: 20rpx;
}
.box2_head {
	white-space: nowrap;
	font-size:30rpx;
	font-family:PingFang SC;
	font-weight:500;
	color:rgba(51,51,51,1);
}
.box2_1 {
	height: 88rpx;
	border-bottom: 1px solid #EEEDF2;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.fot1 {
	font-size: 30rpx;
	font-family: PingFang SC;
	font-weight: bold;
	color: rgba(51, 51, 51, 1);
}
.box2 {
	padding: 30rpx;
	padding-bottom: 0;
	box-sizing: border-box;
}
.line {
	height: 20rpx;
	background: #EEEDF2;
}
.active {
	background: #4185f5;
	border: 1rpx solid #4185f5 !important;
	border-radius: 10rpx;
	color: #FFFFFF !important;
}
.box1_r > view {
	/* width:86rpx;
		height:44rpx; */
	padding: 10rpx 20rpx;
	box-sizing: border-box;
	border: 1rpx solid rgba(153, 153, 153, 1);
	border-radius: 10rpx;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-left: 10rpx;
	font-size: 26rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: rgba(51, 51, 51, 1);
}
.box1_r {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
.box1 {
	height: 100rpx;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0 30rpx;
	box-sizing: border-box;
}
</style>
